<template>
  <div class="app-container">
    <el-tabs type="border-card" :value="activeTab" @tab-click="changeTab">
      <el-tab-pane v-if="roleCheck('edit-member-info')" label="更改会员资料" name="one">
        <edit-member-info
          v-show="activeTab === 'one'"
          :edit-able="true" />
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('reset-name-bank')" name="two" label="重置姓名及银行卡">
        <edit-bank-card
          v-show="activeTab === 'two'"/>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
  import {tabs} from '@/build'
import EditBankCard from '@/views/member/detail/editBankCard'
import EditMemberInfo from '@/views/member/detail/editMemberInfo'
import EditMemberPass from '@/views/member/detail/editMemberPass'
import ApplyDialog from "@/views/member/list/applyDialog";
import EditNameCard from "@/views/member/detail/editNameCard";
export default {
  name: "edit-dialog",
  props: ['edit-data'],
  components: {EditNameCard, ApplyDialog, EditMemberInfo, EditBankCard, EditMemberPass},
  mixins:[tabs],
  data() {
    return {
      activeTab: 'one',
    }
  },
  mounted(){
    this.activeTab = this.roleCheck('edit-member-info') ? 'one' : 'two';
  },
}

</script>
<style lang="scss" scoped>
.box-card {
  margin-bottom: 20px;
}

</style>
